<template>
	<div class="fc">
		<el-image v-show="imgUrl" :src="imgUrl" style="width: 30%; height: 100%" :preview-src-list="[imgUrl]"></el-image>
		<PageLoading v-if="loading" />
	</div>
</template>

<script setup lang="ts">
import VueQrcode from 'vue-qrcode'
import apiMod from '@/apiMod/index'
import { useCommonStore } from '@/stores/common'
const props = withDefaults(
	defineProps<{
		text: string
		width?: number
	}>(),
	{
		width: 200,
	}
)
const loading = ref(false)
const imgUrl = ref('')
const getInitData = () => {
  const { queryObj } = storeToRefs(useCommonStore())
	loading.value = true
	apiMod
		.serviceobject_qrcode_page({
			idCard: props.text,
      ...queryObj.value,
      belongProjectLabel:undefined,

		})
		.then((res) => {
			const data = res.data.records
			if (data.length > 0) {
				imgUrl.value = `data:image/png;base64,${data[0].qrcode}`
			}
			loading.value = false
		})
		.catch(() => {
			loading.value = false
		})
}

onMounted(() => {
	getInitData()
})
</script>

<style scoped>
.fc {
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
</style>
